import { reactive, ref } from 'vue'
import { editPasswordFn } from '@/api/login'
import {ElMessage} from 'element-plus'

export function useEditPassword() {
    // 默认关闭“修改密码”对话框
    const dialogEditPassword=ref(false)
    // form表单数据源
    const ruleFormEdit=reactive({
        oldpassword:'',
        password:'',
        repassword:''
    })
    // form表单验证规则
    const rulesEdit=reactive({
        oldpassword:[
            {required:true,message:'请输入原始密码',trigger:'blur'}
        ],
        password:[
            {required:true,message:'请输入新密码',trigger:'blur'}
        ],
        repassword:[
            {required:true,message:'请输入确认密码',trigger:'blur'}
        ]
    })
    // 获取form表单DOM元素
    const ruleFormRefEdit=ref(null)
    // 调用修改密码API
    const editPasswordHadle=()=>{
        ruleFormRefEdit.value.validate(async isValid=>{
            if(isValid){
                return
            }
            // 验证通过，调用修改密码API
            const res=await editPasswordFn(ruleFormEdit)
            console.log(res.data)
            if(res.code!=200){
            // 密码修改失败
            return ElMessage.error(res.message)
            }

            // 密码修改成功
            ElMessage({
                message:'密码修改成功',
                type:'success'
            })
            // 关闭对话框
            dialogEditPassword.value=false
        })
    }
  // 导出属性和方法
  return{
    dialogEditPassword,
    ruleFormEdit,
    rulesEdit,
    ruleFormRefEdit,
    editPasswordHadle
  }
}